<template>
  <a-card :bordered="false" title="">
    <a-form-model
      ref="ruleForm"
      :model="form"
      :rules="rules"
      :label-col="{ span: 4 }"
      :wrapper-col="{ span: 14 }"
    >
      <!-- <a-form-model-item ref="username" label="用户名" prop="username">
        <a-input v-model="form.username" class="w-72" />
      </a-form-model-item> -->

      <a-form-model-item ref="mobile" label="手机号" prop="mobile">
        <a-input v-model="form.mobile" class="w-72" />
      </a-form-model-item>

      <a-form-model-item ref="fee_ratio" label="佣金比例" prop="fee_ratio">
        <a-input-number
          class="w-72"
          :step="0.001"
          :min="0"
          :max="max_fee"
          v-model="form.fee_ratio"
        />
      </a-form-model-item>
      <a-form-model-item ref="tip" label="单笔奖励" prop="tip">
        <a-input-number
          class="w-72"
          :step="1"
          :min="0"
          :max="max_tip"
          v-model="form.tip"
        />
      </a-form-model-item>

      <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
        <a-button type="primary" @click="onSubmit"> 提 交 </a-button>
      </a-form-model-item>
    </a-form-model>
  </a-card>
</template>
<script>
import { mapGetters } from 'vuex'

export default {
  data() {
    return {
      form: {
        // username: '',
        mobile: '',
        fee_ratio: 0,
        tip: 0,
      },
      rules: {
        mobile: [
          {
            required: true,
            message: '请输入',
            trigger: 'blur',
          },
        ],
        fee_ratio: [
          {
            required: true,
            message: '请输入',
            trigger: 'blur',
          },
        ],
        tip: [
          {
            required: true,
            message: '请输入',
            trigger: 'blur',
          },
        ],
      },
      // max_fee: 0,
      // max_tip: 0,
    }
  },
  computed: {
    ...mapGetters('account', ['user']),
    max_fee() {
      return 1 * this.user.fee_ratio
    },
    max_tip() {
      return 1 * this.user.tip
    },
  },
  mounted() {
    // console.log(this.max_fee, this.max_tip)
    this.resetForm()
  },
  methods: {
    onSubmit() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          this.axios.post('/g/members', this.form).then((res) => {
            if (res.data.code !== 1) {
              this.$message.error(res.data.msg)
            } else {
              this.$message.success('新增成功')
              this.$refreshPage('/members/index')
              this.$router.push('/members/index')
            }
          })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    resetForm() {
      this.$refs.ruleForm.resetFields()
    },
  },
}
</script>


